import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import _applyDecoratedDescriptor from "@babel/runtime/helpers/esm/applyDecoratedDescriptor";

var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _dec9, _dec10, _dec11, _dec12, _dec13, _dec14, _class, _class2;

/**
 * PageDetail.js
 * @date 2018/9/29
 */
import React from 'react';
import { connect } from 'dva';
import { Button, Form, Table, Input, Row, Col } from 'antd';
import { routerRedux } from 'dva/router';
import { Bind } from 'lodash-decorators';
import { Header, Content } from 'components/Page';
import { Button as ButtonPermission } from 'components/Permission';
import cacheComponent from 'components/CacheComponent';
import { FORM_FIELD_CLASSNAME, FORM_COL_4_LAYOUT, SEARCH_FORM_ROW_LAYOUT, SEARCH_FORM_ITEM_LAYOUT, SEARCH_COL_CLASSNAME } from 'utils/constants';
import intl from 'utils/intl';
import formatterCollections from 'utils/intl/formatterCollections';
import EditModal from "../../components/EditModal";
var PageList = (_dec = connect(function (_ref) {
  var loading = _ref.loading,
      uiPage = _ref.uiPage;
  return {
    fetching: loading.effects['uiPage/fetchList'],
    uiPage: uiPage
  };
}), _dec2 = Form.create({
  fieldNameProp: null
}), _dec3 = formatterCollections({
  code: ['cpfm.ui']
}), _dec4 = cacheComponent({
  cacheKey: '/cpfm/ui/page/list'
}), _dec5 = Bind(), _dec6 = Bind(), _dec7 = Bind(), _dec8 = Bind(), _dec9 = Bind(), _dec10 = Bind(), _dec11 = Bind(), _dec12 = Bind(), _dec13 = Bind(), _dec14 = Bind(), _dec(_class = _dec2(_class = _dec3(_class = _dec4(_class = (_class2 = /*#__PURE__*/function (_React$Component) {
  _inherits(PageList, _React$Component);

  var _super = _createSuper(PageList);

  function PageList(props) {
    var _this;

    _classCallCheck(this, PageList);

    _this = _super.call(this, props);
    _this.state = {
      // Modal
      createModalProps: {
        visible: false
      },
      updateModalProps: {
        visible: false
      },
      // 分页
      pagination: {}
    };
    return _this;
  }

  _createClass(PageList, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          _this$props$uiPage = _this$props.uiPage,
          _this$props$uiPage$li = _this$props$uiPage.list,
          list = _this$props$uiPage$li === void 0 ? {} : _this$props$uiPage$li,
          _this$props$uiPage$pa = _this$props$uiPage.pagination,
          pagination = _this$props$uiPage$pa === void 0 ? {} : _this$props$uiPage$pa,
          match = _this$props.match,
          fetching = _this$props.fetching;
      var _this$state = this.state,
          _this$state$createMod = _this$state.createModalProps,
          createModalProps = _this$state$createMod === void 0 ? {} : _this$state$createMod,
          _this$state$updateMod = _this$state.updateModalProps,
          updateModalProps = _this$state$updateMod === void 0 ? {} : _this$state$updateMod,
          editRecord = _this$state.editRecord;
      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
        title: intl.get('cpfm.ui.view.list.title').d('页面汇总')
      }, /*#__PURE__*/React.createElement(ButtonPermission, {
        icon: "plus",
        type: "primary",
        permissionList: [{
          code: "".concat(match.path, ".button.create"),
          type: 'button',
          meaning: '页面自定义-新建'
        }],
        onClick: this.handleCreateBtnClick
      }, intl.get('cpaas.common.button.create').d('新建'))), /*#__PURE__*/React.createElement(Content, null, this.renderSearchForm(), /*#__PURE__*/React.createElement(Table, {
        rowKey: "pageId",
        bordered: true,
        columns: this.getColumns(),
        pagination: pagination,
        dataSource: list.content,
        onChange: this.handleStandardTableChange,
        loading: fetching
      }), /*#__PURE__*/React.createElement(EditModal, {
        modalProps: createModalProps,
        onOk: this.handlePageCreate,
        onCancel: this.handleCancelCreate,
        title: intl.get('cpfm.ui.view.list.modal.create.title').d('新建页面'),
        isCreate: true
      }), /*#__PURE__*/React.createElement(EditModal, {
        modalProps: updateModalProps,
        onOk: this.handlePageUpdate,
        onCancel: this.handleCancelUpdate,
        editRecord: editRecord,
        title: intl.get('cpfm.ui.view.list.modal.edit.title').d('编辑页面'),
        wrapClassName: "ant-modal-sidebar-right",
        transitionName: "move-right"
      })));
    }
  }, {
    key: "componentDidMount",
    value: function componentDidMount() {
      this.reloadList();
    }
    /**
     * render search form
     * @returns {*}
     */

  }, {
    key: "renderSearchForm",
    value: function renderSearchForm() {
      var form = this.props.form;
      return /*#__PURE__*/React.createElement(Form, {
        className: "more-fields-search-form"
      }, /*#__PURE__*/React.createElement(Row, SEARCH_FORM_ROW_LAYOUT, /*#__PURE__*/React.createElement(Col, FORM_COL_4_LAYOUT, /*#__PURE__*/React.createElement(Form.Item, Object.assign({
        label: intl.get('cpfm.ui.model.page.pageCode').d('页面编码')
      }, SEARCH_FORM_ITEM_LAYOUT), form.getFieldDecorator('pageCode')( /*#__PURE__*/React.createElement(Input, {
        trim: true,
        typeCase: "upper",
        inputChinese: false
      })))), /*#__PURE__*/React.createElement(Col, FORM_COL_4_LAYOUT, /*#__PURE__*/React.createElement(Form.Item, Object.assign({
        label: intl.get('cpfm.ui.model.page.description').d('页面描述')
      }, SEARCH_FORM_ITEM_LAYOUT), form.getFieldDecorator('description')( /*#__PURE__*/React.createElement(Input, {
        className: FORM_FIELD_CLASSNAME
      })))), /*#__PURE__*/React.createElement(Col, Object.assign({}, FORM_COL_4_LAYOUT, {
        className: SEARCH_COL_CLASSNAME
      }), /*#__PURE__*/React.createElement(Form.Item, null, /*#__PURE__*/React.createElement(Button, {
        onClick: this.handleResetBtnClick
      }, intl.get('cpaas.common.button.reset').d('重置')), /*#__PURE__*/React.createElement(Button, {
        type: "primary",
        htmlType: "submit",
        onClick: this.handleSearchBtnClick
      }, intl.get('cpaas.common.button.search').d('查询'))))));
    }
    /**
     * get table's columns
     * @returns {object[]} columns
     */

  }, {
    key: "getColumns",
    value: function getColumns() {
      var _this2 = this;

      var match = this.props.match;

      if (!this.columns) {
        this.columns = [{
          title: intl.get('cpfm.ui.model.page.pageCode').d('页面编码'),
          dataIndex: 'pageCode',
          width: 200
        }, {
          title: intl.get('cpfm.ui.model.page.description').d('页面描述'),
          dataIndex: 'description'
        }, {
          title: intl.get('cpaas.common.button.action').d('操作'),
          key: 'action',
          width: 130,
          render: function render(_, record) {
            return /*#__PURE__*/React.createElement("span", {
              className: "action-link"
            }, /*#__PURE__*/React.createElement(ButtonPermission, {
              type: "text",
              permissionList: [{
                code: "".concat(match.path, ".button.edit"),
                type: 'button',
                meaning: '页面自定义-编辑'
              }],
              onClick: function onClick(e) {
                e.preventDefault();

                _this2.handlePageUpdateTrigger(record);
              }
            }, intl.get('cpaas.common.button.edit').d('编辑')), /*#__PURE__*/React.createElement(ButtonPermission, {
              type: "text",
              permissionList: [{
                code: "".concat(match.path, ".button.pageCode"),
                type: 'button',
                meaning: '页面自定义-页面设计'
              }],
              onClick: function onClick(e) {
                e.preventDefault();

                _this2.handleEditPage(record.pageCode);
              }
            }, "\u9875\u9762\u8BBE\u8BA1"));
          }
        }];
      }

      return this.columns;
    }
    /**
     * search btn click, trigger queryList
     * @param {CompositionEvent} e
     */

  }, {
    key: "handleSearchBtnClick",
    value: function handleSearchBtnClick(e) {
      e.preventDefault();
      this.queryList();
    }
    /**
     * reset search form
     */

  }, {
    key: "handleResetBtnClick",
    value: function handleResetBtnClick() {
      var form = this.props.form;
      form.resetFields();
    }
    /**
     * reload list
     */

  }, {
    key: "reloadList",
    value: function reloadList() {
      var pagination = this.state.pagination;
      this.queryList(pagination);
    }
    /**
     * query list
     * @param {Number} pagination.pagination
     * @param {Number} pagination.sorter
     */

  }, {
    key: "queryList",
    value: function queryList() {
      var pagination = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
      var _this$props2 = this.props,
          form = _this$props2.form,
          dispatch = _this$props2.dispatch;
      var formValues = form.getFieldsValue();
      this.setState({
        pagination: pagination
      });
      dispatch({
        type: 'uiPage/fetchList',
        payload: {
          body: formValues,
          page: pagination.pagination,
          sort: pagination.sorter
        }
      });
    }
    /**
     * table change
     */

  }, {
    key: "handleStandardTableChange",
    value: function handleStandardTableChange(pagination, filtersArg, sorter) {
      this.queryList({
        pagination: pagination,
        filtersArg: filtersArg,
        sorter: sorter
      });
    }
    /**
     * goto pageDetail
     * @param pageCode
     */

  }, {
    key: "handleEditPage",
    value: function handleEditPage(pageCode) {
      var dispatch = this.props.dispatch;
      dispatch(routerRedux.push({
        pathname: "/cpfm/ui/page/detail/".concat(pageCode)
      }));
    }
    /**
     * create btn click
     */

  }, {
    key: "handleCreateBtnClick",
    value: function handleCreateBtnClick() {
      this.setState({
        createModalProps: {
          visible: true
        }
      });
    }
    /**
     * edit record, open edit modal
     * @param record
     */

  }, {
    key: "handlePageUpdateTrigger",
    value: function handlePageUpdateTrigger(record) {
      this.setState({
        editRecord: record,
        updateModalProps: {
          visible: true
        }
      });
    }
    /**
     * cancel create
     */

  }, {
    key: "handleCancelCreate",
    value: function handleCancelCreate() {
      this.setState({
        createModalProps: {
          visible: false
        }
      });
    }
    /**
     * cancel update
     */

  }, {
    key: "handleCancelUpdate",
    value: function handleCancelUpdate() {
      this.setState({
        editRecord: null,
        updateModalProps: {
          visible: false
        }
      });
    }
    /**
     * create page
     * @param data
     */

  }, {
    key: "handlePageCreate",
    value: function handlePageCreate(data) {
      var _this3 = this;

      var dispatch = this.props.dispatch;
      dispatch({
        type: 'uiPage/listCreateOne',
        payload: data
      }).then(function (res) {
        if (res) {
          _this3.setState({
            createModalProps: {
              visible: false
            }
          });

          _this3.reloadList();
        }
      });
    }
    /**
     * update page
     * @param data
     */

  }, {
    key: "handlePageUpdate",
    value: function handlePageUpdate(data) {
      var _this4 = this;

      var dispatch = this.props.dispatch;
      dispatch({
        type: 'uiPage/listUpdateOne',
        payload: data
      }).then(function (res) {
        if (res) {
          _this4.setState({
            updateModalProps: {
              visible: false
            }
          });

          _this4.reloadList();
        }
      });
    }
  }]);

  return PageList;
}(React.Component), (_applyDecoratedDescriptor(_class2.prototype, "handleSearchBtnClick", [_dec5], Object.getOwnPropertyDescriptor(_class2.prototype, "handleSearchBtnClick"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleResetBtnClick", [_dec6], Object.getOwnPropertyDescriptor(_class2.prototype, "handleResetBtnClick"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleStandardTableChange", [_dec7], Object.getOwnPropertyDescriptor(_class2.prototype, "handleStandardTableChange"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleEditPage", [_dec8], Object.getOwnPropertyDescriptor(_class2.prototype, "handleEditPage"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleCreateBtnClick", [_dec9], Object.getOwnPropertyDescriptor(_class2.prototype, "handleCreateBtnClick"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handlePageUpdateTrigger", [_dec10], Object.getOwnPropertyDescriptor(_class2.prototype, "handlePageUpdateTrigger"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleCancelCreate", [_dec11], Object.getOwnPropertyDescriptor(_class2.prototype, "handleCancelCreate"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleCancelUpdate", [_dec12], Object.getOwnPropertyDescriptor(_class2.prototype, "handleCancelUpdate"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handlePageCreate", [_dec13], Object.getOwnPropertyDescriptor(_class2.prototype, "handlePageCreate"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handlePageUpdate", [_dec14], Object.getOwnPropertyDescriptor(_class2.prototype, "handlePageUpdate"), _class2.prototype)), _class2)) || _class) || _class) || _class) || _class);
export { PageList as default };